<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@taglib uri="http://www.springframework.org/tags/form" prefix="form" %>
    <%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
    <%@taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/resource/js/jquery-3.2.1.js"></script>
</head>
<body>
	<form:form action="${pageContext.request.contextPath }/toupdate" modelAttribute="claim" method="post" enctype="multipart/form-data" id="fm">
		单据编号
		<c:if test="${claim.id==null }">
			<input type="text" name="id">
		</c:if>
		<c:if test="${claim.id!=null }">
			<form:hidden path="id"/>${claim.id }
		</c:if>
		<br>
		报销人<form:input path="name"/><br>
		费用发生期
		<input type="text" name="feeDate" value="<fmt:formatDate value="${claim.feeDate }" pattern="yyyy-MM-dd"/>">
		<br>
		所属部门<form:input path="dept"/><br>
		报销日期<input type="text" name="date" value="<fmt:formatDate value="${claim.date }" pattern="yyyy-MM-dd"/>"><br>
		费用金额<form:input path="fee"/><br>
		附件<form:hidden path="appedix"/>
			<input type="file" name="file">
		<br>
		<input type="button" onclick="zj()" value="增加">
			<table>
				<thead>
					<tr>
						<td>行号</td>
						<td>费用类别</td>
						<td>报销金额</td>
						<td>备注</td>
						<td>操作</td>
					</tr>
				</thead>
				<tbody id="tbody">
					<c:forEach items="${claim.details }" var="cd" varStatus="inde">
						<tr class="de" >
							<td><input type="text" name="details[${inde.index }].num" value="${cd.num }"></td>
							<td><input type="text" name="details[${inde.index }].type" value="${cd.type }"></td>
							<td><input type="text" name="details[${inde.index }].money" value="${cd.money }"></td>
							<td><input type="text" name="details[${inde.index }].rmk" value="${cd.rmk }"></td>
							<td><input type="button" value="删除"  onclick="deletede(this)"></td>
						</tr>
					</c:forEach>
				</tbody>
			</table>
		<input type="button" value="提交" onclick="tj()" >
	</form:form>
	<script type="text/javascript">
		var count = $(".de").length;
		function zj(){
			$("#tbody").append('<tr class="de"><td><input type="text" name="details['+count+'].num"></td><td><input type="text" name="details['+count+'].type"></td><td><input type="text" name="details['+count+'].money" ></td><td><input type="text" name="details['+count+'].rmk" ></td><td><input type="button" value="删除"  onclick="deletede(this)"></td></tr>');
			count++;
		}
		function deletede(thiz) {
			$(thiz).parent().parent().remove();
		}
		function tj(){
			var num = $(".de").length;
			if (num>0) {
				$("#fm").submit();
			}else {
				alert("请添加一个");
			}
		}
	</script>
</body>
</html>